<template>
	<div id="contentBox">
		<div class="searchBox">
			<el-form :inline="true"  ref="searchForm"  :model="searchForm" label-width="96px">
				<el-form-item label="申请日期起" prop="startDate" >
				    <el-date-picker :editable="false"   
				      @change="debounceSeach"
				      v-model="searchForm.startDate"
				      type="date"
				      placeholder="选择日期"
				      :picker-options="startDateOpt"
				      >
				    </el-date-picker>
				</el-form-item>
				<el-form-item label="申请日期止" prop="endDate" >
				    <el-date-picker :editable="false"  
				      @change="debounceSeach"
				      v-model="searchForm.endDate"
				      type="date"
				      placeholder="选择日期"
				      :picker-options="endDateOpt"
				      >
				    </el-date-picker>
				</el-form-item>
	            <el-form-item label="订单号" prop="orderNumber" >
				    <el-input v-model="searchForm.orderNumber" placeholder="请输入搜索内容..." @input.native="debounceSeach"></el-input >
				</el-form-item>
				
				<el-form-item label="汽车车型" prop="carName">
				  	<el-input v-model="searchForm.carName" placeholder="请输入搜索内容..." @input.native="debounceSeach"></el-input >
			    </el-form-item>
			    <el-form-item label="物流公司" prop="company">				   
				    <el-input v-model="searchForm.company" placeholder="请输入搜索内容..." @input.native="debounceSeach"></el-input >
				</el-form-item>
				<el-form-item label="物流状态" prop="status">				   
				    <el-select v-model="searchForm.status" placeholder="请选择物流状态" @change="debounceSeach">
				    	<el-option label="请选择物流状态" value=""></el-option>		   
				    	<!-- <el-option v-for="(item, index) in carOrderStatusMap" :label="item" :value="index" :key="index"></el-option> -->
					</el-select>
				</el-form-item>
					           
				<el-form-item style="">
				    <el-button @click="resetSearchForm('searchForm')">重置</el-button>
				</el-form-item>
			</el-form>
		</div>
		<div id="tableBox" style="margin:25px 25px 0" >
			<el-table :data="tableData.data" border  >
			    <el-table-column label="订单号" >
			      <template scope="scope">
			        <span >{{ scope.row.px }}</span>
			      </template>
			    </el-table-column>
			    
			    <el-table-column label="汽车车型"  :show-overflow-tooltip="true">
			      <template scope="scope">
			        <span >{{ scope.row.carBrandNameAndCarName }}</span>
			      </template>
			    </el-table-column>
			    <el-table-column label="物流公司" >
			      <template scope="scope">
			        <span >{{ scope.row.company }}</span>
			      </template>
			    </el-table-column>
			    <el-table-column label="物流费" >
			      <template scope="scope">
			        <span >{{ scope.row.paymentAmount | toFixed2 }}</span>
			      </template>
			    </el-table-column>
			    <el-table-column label="放空费" >
			      <template scope="scope">
			        <span >{{ scope.row.paymentAmount | toFixed2 }}</span>
			      </template>
			    </el-table-column>
			    <el-table-column label="物流状态" >
			      <template scope="scope">
			      	<!-- <span  v-for="(index, item) in scope.row.statusVO" >{{ item }}</span> -->
			        
			      </template>
			    </el-table-column>
			    <el-table-column label="申请时间" width="180">
			      <template scope="scope">
			        <!-- <span >{{ scope.row.paymentAmount | parseTime }}</span> -->
			      </template>
			    </el-table-column>
			    <el-table-column label="操作" width="140">
			      <template scope="scope">
			      	<el-button size="small" @click="handleEdit(scope.$index, scope.row)">确认</el-button>
			      	<el-button size="small" @click="handleSee(scope.$index, scope.row)">查看</el-button>
			      </template>
			    </el-table-column>
			</el-table>
			<el-dialog title="物流管理" :visible.sync="dialogSendData.dialogFormVisible" v-if="dialogSendData.dialogFormVisible" top='5%' >
                <dialogForm :dialogSendData="dialogSendData" :tableData="tableData" :carOrderId="carOrderId" v-on:refreshSeachData="seachData"  ></dialogForm>	
			</el-dialog>
			
		</div>
        <div class="block" style="text-align: center;margin-top: 15px;position:relative;">
		    <pagination v-on:refreshSeachData="seachData"  :tableData="tableData" :searchForm="searchForm||{}"></pagination>
		    
		</div>
		
	</div>
	
</template>
<script src="./index.js"></script>
<style scoped lang="scss">
	@import "./index.scss"
</style>